<template>
  <main class="px-6 pb-6">
    <s-navs :navs="['menu.visualization.ExpandChart']" />

    <div class="s-section flex">
      <leftMenu class="w-[20%]" @menu-click="handleMenuClick" />
      <rightMenu class="w-[80%]" :selected-item="selectedItem" />
    </div>
  </main>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import leftMenu from './widgets/leftMenu.vue'
import rightMenu from './widgets/rightMenu.vue'
import type prefabricatedType from './type'

const selectedItem = ref<prefabricatedType | null>(null) // 明确类型
// 处理子组件点击事件
const handleMenuClick = (item: prefabricatedType) => {
  selectedItem.value = item // 直接更新数据，无需强制刷新
  console.log(selectedItem.value.value)
}
</script>
